<template>
  <div id="dswd-home-five">
    <div v-if="device==='desktop'" class="dswd-home-five">
      <div class="five-top" />
      <div class="five-icon">
        <img src="../../assets/image/home/five/save-icon.png" alt="save-icon">
      </div>
      <div class="five-sub-title">时间成本、人力成本、资金成本，全面大幅度降低</div>
      <div class="five-content">
        <div class="block">
          <div class="block-title">3天出图</div>
          <div class="block-sub-title">大幅压缩施工图设计周期</div>
          <div class="block-dividing-line" />
          <div class="block-headlines">10倍</div>
          <div class="block-sub-headlines">效率提升</div>
        </div>
        <div class="block">
          <div class="block-title">1人操作</div>
          <div class="block-sub-title">每个专业一人操作，人机耦合</div>
          <div class="block-dividing-line" />
          <div class="block-headlines">5倍</div>
          <div class="block-sub-headlines">人效提升</div>
        </div>
      </div>
      <div class="five-route" />
      <div class="five-saving-summary">
        <span class="span-button">设计成本降低90%   建安成本降低10%</span>
      </div>
    </div>
    <div v-if="device==='ipad'" class="dswd-p-home-five">
      <div class="five-top" />
      <div class="five-icon">
        <img src="../../assets/image/home/five/save-icon.png" alt="save-icon">
      </div>
      <div class="five-sub-title">时间成本、人力成本、资金成本，全面大幅度降低</div>
      <div class="five-content">
        <div class="block">
          <div class="block-title">3天出图</div>
          <div class="block-sub-title">大幅压缩施工图设计周期</div>
          <div class="block-dividing-line" />
          <div class="block-headlines">10倍</div>
          <div class="block-sub-headlines">效率提升</div>
        </div>
        <div class="block">
          <div class="block-title">1人操作</div>
          <div class="block-sub-title">每个专业一人操作，人机耦合</div>
          <div class="block-dividing-line" />
          <div class="block-headlines">5倍</div>
          <div class="block-sub-headlines">人效提升</div>
        </div>
      </div>
      <div class="five-route" />
      <div class="five-saving-summary">
        <span class="span-button">设计成本降低90%   建安成本降低10%</span>
      </div>
    </div>
    <div v-if="device==='mobile'" class="dswd-m-home-five">
      <div class="five-top" />
      <div class="five-icon">
        <img src="../../assets/image/home/five/save-icon.png" alt="save-icon">
      </div>
      <div class="five-sub-title">时间成本、人力成本、资金成本，全面大幅度降低</div>
      <div class="five-content">
        <div class="block">
          <div class="block-title">3天出图</div>
          <div class="block-sub-title">大幅压缩施工图设计周期</div>
          <div class="block-dividing-line" />
          <div class="block-headlines">10倍</div>
          <div class="block-sub-headlines">效率提升</div>
        </div>
        <div class="block">
          <div class="block-title">1人操作</div>
          <div class="block-sub-title">每个专业一人操作，人机耦合</div>
          <div class="block-dividing-line" />
          <div class="block-headlines">5倍</div>
          <div class="block-sub-headlines">人效提升</div>
        </div>
      </div>
      <div class="five-route" />
      <div class="five-saving-summary">
        <span class="span-button">设计成本降低90%   建安成本降低10%</span>
      </div>
    </div>
  </div>
</template>

<script>
import { mapState } from 'vuex'
export default {
    data() {
        return {
        }
    },
    computed: {
      ...mapState({
        device: (state) => state.app.device
      })
    },
    methods: {}
}
</script>

<style lang="scss" scoped>
@import "~@/styles/home/five.scss";
</style>
